import { fileURLToPath, URL } from 'node:url'

import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import Icons from 'unplugin-icons/vite'
import IconsResolver from 'unplugin-icons/resolver'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { createStyleImportPlugin, ElementPlusResolve } from 'vite-plugin-style-import'
export default defineConfig(({ mode }) => {
	const config = loadEnv(mode, './')
	return {
		plugins: [
			vue(),

			AutoImport({
				// Auto import functions from Vue, e.g. ref, reactive, toRef...
				// 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
				imports: ['vue'],

				// Auto import functions from Element Plus, e.g. ElMessage, ElMessageBox... (with style)
				// 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
				resolvers: [
					ElementPlusResolver(),

					// Auto import icon components
					// 自动导入图标组件
					IconsResolver({
						prefix: 'Icon',
					}),
				],
			}),

			Components({
				resolvers: [
					// Auto register icon components
					// 自动注册图标组件
					IconsResolver({
						enabledCollections: ['ep'],
					}),
					// Auto register Element Plus components
					// 自动导入 Element Plus 组件
					ElementPlusResolver(),
				],
			}),

			Icons({
				autoInstall: true,
			}),

			createStyleImportPlugin({
				resolves: [ElementPlusResolve()],
				libs: [
					{
						libraryName: 'element-plus',
						esModule: true,
						resolveStyle: (name: string) => {
							return `element-plus/theme-chalk/${name}.css`
						}
					}
				]
			})
		],
		resolve: {
			alias: {
				'@': fileURLToPath(new URL('./src', import.meta.url))
			}
		},
		server: {
			host: '0.0.0.0',
			proxy: {
				'/api': {
					target: config.VITE_BASE_URL,
					changeOrigin: true,
					rewrite: (path) => path.replace(/^\/api/, '')
				}
			}
		},
		base: './'
	}
})
